﻿@model Testicide.Models.Project

@{
    ViewBag.Title = "Details";
}

    <div class="order">
        <h3>@Model.Name</h3> 
        <table class="table table-hover" style="border:thin;">
            <tr>
                <th>
                    Create Module
                    <a id="openDialog" href="@Url.Action("AddEditRecord", "Module", new { proID = Model.ID })">
                        <img id="add" style="width:25px; height:25px;margin-left:20px;" src="~/pictures/addnew.png" />
                    </a>
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.Modules.First().Date)
                </th>
                <th>
                    @using (Html.BeginForm("Search", "Module"))
                    {
                        <input id="searchtxt" name="searchString" type="text" />
                        <button style="width: 20px; height: 20px; border:none; background-color:white;"><img id="search" style="width:20px; height:20px; background-color:none; border:none;" src="~/pictures/search.png" /></button>
                    }
                </th>
                
            </tr>
            @foreach (var item in Model.Modules)
            {
                <tr>
                    <td>
                        <a id="details_@item.ID" href="@Url.Action("Details","Module", new { id=item.ID })">@item.Name</a>
                    </td>
                    <td>
                        @item.Date
                    </td>
                    <td>
                            <a class="editDialog" id="editModule_@item.ID" href="@Url.Action("AddEditRecord", "Module", new { id = item.ID })">
                                <img class="icons" src="~/pictures/edit.png" /> |
                            </a>
                        <a class="confirmDialog" id="deleteModule_@item.ID" href="@Url.Action("DeleteRecord", "Module", new { id = item.ID })">
                            <img class="icons" src="~/pictures/delete.png" />
                        </a>
                    </td>
                    
                </tr>
            }
            
        </table>
    </div>
    <div id="dialog-confirm" style="display: none">
        <p>
            <span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>
            Are you sure to delete ?
        </p>
    </div>
    <div id="dialog-edit" style="display: none">

    </div>
    <div id="dialog-view" style="display: none">

    </div> 
 
@section Scripts
{
    <script type="text/javascript">
    $(document).ready(function () {
        $.ajaxSetup({ cache: false });
        $("#openDialog").live("click", function (e) {
            e.preventDefault();
            var url = $(this).attr('href');
            $("#dialog-edit").dialog({
                title: 'Add Module',
                autoOpen: false,
                resizable: false,
                height: 355,
                width: 400,
                show: { effect: 'drop', direction: "up" },
                modal: true,
                draggable: true,
                open: function (event, ui) {
                    $(this).load(url);
                },
                close: function (event, ui) {
                    $(this).dialog('close');
                }
            });

            $("#dialog-edit").dialog('open');
            return false;
        });

        $(".editDialog").live("click", function (e) {
            var url = $(this).attr('href');
            $("#dialog-edit").dialog({
                title: 'Edit Module',
                autoOpen: false,
                resizable: false,
                height: 355,
                width: 400,
                show: { effect: 'drop', direction: "up" },
                modal: true,
                draggable: true,
                open: function (event, ui) {
                    $(this).load(url);
                },
                close: function (event, ui) {
                    $(this).dialog('close');
                }
            });
            $("#dialog-edit").dialog('open');
            return false;
        });

        $(".confirmDialog").live("click", function (e) {
            var url = $(this).attr('href');
            $("#dialog-confirm").dialog({
                autoOpen: false,
                resizable: false,
                height: 170,
                width: 350,
                show: { effect: 'drop', direction: "up" },
                modal: true,
                draggable: true,
                buttons: {
                    "OK": function () {
                        $(this).dialog("close");
                        window.location = url;
                    },
                    "Cancel": function () {
                        $(this).dialog("close");
                    }
                }
            });
            $("#dialog-confirm").dialog('open');
            return false;
        });
    });

</script>

    <script type="text/javascript" language="javascript">
        $(document).ready(function () {
            $('#searchtxt').autocomplete({
                source: '@Url.Action("AutoComplete","Module")'
            });
                })
    </script>
}